<template>
	<view class="container">
		<view class="top_box">
			<image src="https://cdjjyl.com.cn/images/isp/declare.png" class="bg"></image>
			<view class="apply_box">
				<view class="apply" @click="navTo('/package_biz/pages/declare/declareList')">
					<image src="/static/image/declarationList.png" style="width: 68upx;height: 66upx;align-self:center">
					</image>
					<view class="announce_all">
						<view class="announce_title">申报列表</view>
						<view class="announce_text">申报记录查看</view>
					</view>
				</view>
				<view class="announce" @click="navTo('/package_biz/pages/declare/verifyList')">
					<image src="/static/image/verification.png" style="width: 68upx;height: 66upx;align-self:center">
					</image>
					<view class="announce_all">
						<view class="announce_title">身份核验</view>
						<view class="announce_text">身份信息核实</view>
					</view>
				</view>
			</view>
		</view>
		<view class="bottom_box">
			<view v-for="item in partyList" @click="navTo(item.url)">
				<view class="list_box" v-if="item.show">
					<view class="list_title">{{item.title}}</view>
					<view class="more_box">
						<image src="/static/image/more1.png" class="more_box"></image>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex';

	export default {
		name: "declareIndex",
		data() {
			return {
				partyList: [{
					title: '80岁以上高龄补贴申请',
					url: '/package_biz/pages/declare/oldman/declareAddOldMan',
					show: true
				}, {
					title: '最低生活保障金申请',
					url: '/package_biz/pages/declare/declareLife/declareAddLife',
					show: true
				}, {
					title: '困难临时救助金申请',
					url: '/package_biz/pages/declare/declarepoorpeople/declareAddPoorPeople',
					show: true
				}, {
					title: '困难残疾人生活补贴申请',
					url: '/package_biz/pages/declare/employment/declareAddEmployment',
					show: true
				}, {
					title: '医保代交',
					url: '/package_biz/pages/declare/medical/declareAddMedical',
					show: true
				}, {
					title: '农保申请',
					url: '/package_biz/pages/declare/agricultural/declareAddAgricultural',
					show: true
				}, {
					title: '生育服务登记',
					url: '/package_biz/pages/declare/birth/declareAddBirth',
					show: true
				}, {
					title: '养老保险领取申请',
					url: '/package_biz/pages/declare/registration/declareAddRegistration',
					show: true
				}, {
					title: '居民上户',
					url: '/package_biz/pages/declare/household/declareAddHousehold',
					show: true
				}, {
					title: '养老保险注销',
					url: '/package_biz/pages/declare/cancel/declareAddCancel',
					show: true
				}],
				log: ""
			}
		},
		onLoad(options) {
			let params = this.getUrlCode()
			console.log(params)
			let navCode = params.navCode
			let userUuid = params.navId
			if (userUuid) {
				this.$api.request.userInfoAndAreaInfo({
					userUuid: userUuid,
					areaCode: this.$api.request.communityCode
				}, res => {
					if (res.body.status.statusCode === '0') {
						this.login(res.body.data);
						console.log("查询登录信息回调")
						this.toPage(navCode)
					}
				});
			}
		},
		methods: {
			...mapMutations(['login']),
			toPage(navCode) {
				if (navCode) {
					let pageUrl = "";
					switch (navCode) {
						case "disabled-flow":
							pageUrl = "/package_biz/pages/declare/employment/declareAddEmployment";
							break;
						case "poorpeople-flow":
							pageUrl = "/package_biz/pages/declare/declarepoorpeople/declareAddPoorPeople";
							break;
						case "oldman-flow":
							pageUrl = "/package_biz/pages/declare/oldman/declareAddOldMan";
							break;
						case "life-flow":
							pageUrl = "/package_biz/pages/declare/declareLife/declareAddLife";
							break;
						case "medical-flow":
							pageUrl = "/package_biz/pages/declare/medical/declareAddMedical";
							break;
						case "agricultural-flow":
							pageUrl = "/package_biz/pages/declare/agricultural/declareAddAgricultural";
							break;
						case "birth-flow":
							pageUrl = "/package_biz/pages/declare/birth/declareAddBirth";
							break;
						case "registration-flow":
							pageUrl = "/package_biz/pages/declare/registration/declareAddRegistration";
							break;
						case "household-flow":
							pageUrl = "/package_biz/pages/declare/household/declareAddHousehold";
							break;
						case "pension-cancel-flow":
							pageUrl = "/package_biz/pages/declare/cancel/declareAddCancel";
							break;
						default:
							pageUrl = "";
							break;
					}
					if (pageUrl) {
						this.checkInfoIsExpire(navCode)
					}
				}
			},
			// 检验该推送消息是否过期
			checkInfoIsExpire(navCode) {
				let params = {
					typeCode: navCode
				}
				this.$api.request.checkPushInfoIsExpire(params, (res) => {
					if (res.body.status.statusCode === '0') {
						if (res.body.data) {
							this.navTo(pageUrl);
						} else {
							uni.showModal({
								title: "提示",
								content: "该条通知消息还未开始或已过期，请等待通知！",
								success: function(res) {
									window.history.back();
								}
							})
						}
					}
				})
			},
			getUrlCode() { // 截取url中的code方法
				let url = window.location.href
				let theRequest = new Object()
				if (url.indexOf("?") != -1) {
					let paramUrl = url.split("?")[1];
					let strs = paramUrl.split("&")
					for (let i = 0; i < strs.length; i++) {
						theRequest[strs[i].split("=")[0]] = (strs[i].split("=")[1])
					}
				}
				return theRequest
			},
			navTo(url) {
				if (url) {
					uni.navigateTo({
						url: url
					})
				} else {
					this.$api.msg("相关登记业务暂未开放")
				}
			},
		}
	}
</script>

<style scoped>
	.more_box {
		width: 40upx;
		height: 40upx;
		border-radius: 20upx;
		/* background: #E65540; */
	}

	.list_title {
		width: 568upx;
		border-radius: 50upx;
		/* line-height: 80upx; */
		font-size: 30upx;
		font-weight: bold;
		transition: all .5s;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.list_box {
		background: #FFFFFF;
		box-shadow: 2upx 2upx 22upx -2upx rgba(0, 0, 0, 0.1);
		height: 100upx;
		padding: 30upx 30upx 30upx 40upx;
		display: flex;
		justify-content: space-between;
		margin-bottom: 32upx;
		border-radius: 50upx;
	}

	.bottom_box {
		margin: 32upx;
		width: 685upx;
	}

	.announce {
		display: flex;
		height: 80upx;
		width: calc(50% - 60upx);
		margin-right: 20upx;
		margin-left: auto;
	}

	.announce_text {
		font-size: 22upx;
		color: #999999
	}

	.announce_title {
		font-size: 30upx;
		font-weight: bold;
	}

	.announce_all {
		display: flex;
		flex-direction: column;
		margin-left: 16upx;
		justify-content: space-between;
	}

	.apply {
		margin-left: 40upx;
		height: 120upx;
		padding: 20upx 0;
		display: flex;
		width: calc(50% - 40upx);
		position: relative;
		border-right: 2upx solid #D8D8D8;
	}

	.top_box {
		height: 546upx;
		padding: 342upx 32upx 0;
		position: relative;
	}

	.bg {
		filter: drop-shadow(0px 4upx 22upx rgba(0, 0, 0, 0.2));
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 418upx;
	}

	.apply_box {
		position: relative;
		background: white;
		box-shadow: 2upx 2upx 20upx rgba(0, 0, 0, 0.1);
		border-radius: 30upx;
		height: 200upx;
		width: 100%;
		display: flex;
		align-items: center;
	}

	.container {
		width: 100%;
		/* background-color: #FBFBFB; */
		overflow: hidden;
		/* padding: 32upx 20upx 32upx 20upx; */
	}

	page {
		background-color: #FBFBFB;
	}
</style>
